<template>
  <div id="viewInfo">
    <div class="list">
      <div class="ttl">订单信息</div>
      <ul>
        <li><label>订单编号</label>{{ datalist.orderSn }}</li>
        <li><label>门店名称</label>{{ datalist.storeCode }}</li>
        <li><label>创建时间</label>{{ datalist.createTime }}</li>
        <!--        <li><label>订单金额</label>{{ datalist.orderMoney }}</li>-->
        <li><label>订单状态</label>{{ staus[datalist.status] }}</li>
        <li><label>联系人</label>{{ datalist.addressPerson }}</li>
        <li><label>联系电话</label>{{ datalist.addressPhone }}</li>
      </ul>
    </div>
    <div class="list">
      <div class="ttl">基本信息</div>
      <ul>
        <li><label>顾客编号</label>{{ datalist.customerCode }}</li>
        <!--<li><label>面料来源</label>{{datalist.fabricSource}}</li>-->
        <!--<li><label>快递方式</label>{{datalist.courierName}}</li>-->
        <li v-if="datalist.courierId=='1'"><label>快递方式</label>顺丰快递</li>
        <li v-if="datalist.courierId=='2'"><label>快递方式</label>申通快递</li>
        <li v-if="datalist.courierId=='3'"><label>快递方式</label>中通快递</li>
        <li v-if="datalist.courierId=='4'"><label>快递方式</label>德邦快递</li>
        <li><label>顾客性别</label>{{ datalist.customerSex }}</li>
        <li><label>业务来源</label>{{ datalist.businessSource }}</li>
        <li><label>地址</label>{{ datalist.address }}</li>
        <li><label>顾客姓名</label>{{ datalist.customerName }}</li>
        <li><label>包装方式</label>{{ datalist.packageType }}</li>
      </ul>
    </div>
    <div v-for="pro in datalist.productInfoList">
      <div class="list">
        <div class="ttl">{{ pro.productName }}</div>
        <ul>
          <li v-for="x in pro.plbx"><label style="width: 120px">{{ x.smallTemplateName }}</label>{{ x.categoryName }}
          </li>
        </ul>
      </div>
      <div class="list">
        <!-- <div class="ttl">面料辅料</div> -->
        <ul>
          <li v-for="x in pro.fabricList"><label>{{ mianliaottl[x.isMianFu] }}</label>{{ x.fabricCode }}</li>
        </ul>
      </div>
      <div class="list">
        <!-- <div class="ttl">款式工艺</div> -->
        <ul>
          <li v-for="x in pro.ksgy"><label style="width: 120px">{{ x.smallTemplateName }}</label>{{ x.categoryName }}
          </li>
        </ul>
      </div>
      <div class="list">
        <!-- <div class="ttl">绣字撞色</div>
        <div class="towttl">绣字</div> -->
        <ul>
          <li v-if="!!pro.xiuziType"><label>绣字类型</label>{{ pro.xiuziType }}</li>
          <li v-if="!!pro.xiuziWeizhi"><label>绣字位置</label>{{ pro.xiuziWeizhi }}</li>
          <li v-if="!!pro.xiuziImg"><label>绣字图片</label>{{ pro.xiuziImg }}</li>
          <li v-if="!!pro.xiuziColor"><label>绣字颜色</label>{{ pro.xiuziColorEntity.colorName }}</li>
          <li v-if="!!pro.xiuziHeight"><label>绣字高度</label>{{ pro.height }}</li>
          <li v-if="!!pro.xiuziZiti"><label>绣字字体</label>{{ pro.font.embroideredName }}</li>
          <li v-if="!!pro.xiuziOneNeirong"><label>第一行内容</label>{{ pro.xiuziOneNeirong }}</li>
          <li v-if="!!pro.xiuziTwoNeirong"><label>第二行内容</label>{{ pro.xiuziTwoNeirong }}</li>
          <li v-if="pro.zidingyiImg!=null && pro.zidingyiImg!=''"><label>自定图片</label><img :src="pro.zidingyiImg"
                                                                                          data-action="zoom"
                                                                                          width="100" height="100"
                                                                                          alt=""></li>
        </ul>
        <br/>
        <!-- <div class="towttl">撞色</div> -->
        <ul style="margin-top: 40px">
          <li v-for="x in pro.allConColor"><label>{{ x.contrastColorName }}</label>{{ x.colorName }}</li>
        </ul>
      </div>

      <!--面料辅料-->
      <div class="list">
        <p style="font-weight: bolder">面料辅料</p>
        <ul>
          <li><label>面料</label>{{ pro.fabricCode }}</li>
          <li><label>面料备注</label>{{ pro.fabricRemark }}</li>
          <li v-if="pro.libuInfo!=null"><label>里布</label>{{ pro.libuInfo.libuCode }}</li>
          <li v-if="pro.dilinniInfo!=null"><label>底领呢</label>{{ pro.dilinniInfo.dilinniNumber }}</li>
          <li v-for="x in pro.buttonsInfoList"><label>纽扣</label>{{ x.buttonsCode }}</li>
        </ul>
      </div>


      <div class="list">
        <!-- <div class="ttl">量体信息</div> -->
        <p style="font-weight: bolder">成衣尺寸</p>
        <ul>
          <li v-for="x in pro.cheng"><label>{{ x.sizeName }}</label>{{ x.bodysizeValue }}</li>
        </ul>
      </div>


      <div class="list">
        <!-- <div class="ttl">净体尺寸</div> -->
        <p style="font-weight: bolder">净体尺寸</p>
        <ul>
          <li v-for="x in pro.jing"><label>{{ x.sizeName }}</label>{{ x.bodysizeValue }}</li>
        </ul>
      </div>

      <div class="list">
        <!-- <div class="ttl">体型数据</div> -->
        <p style="font-weight: bolder">体型数据</p>
        <ul>
          <li v-for="x in pro.sizeInfoList"><label>{{ x.sizeName }}</label>{{ x.size1 }}</li>
        </ul>
      </div>

      <div class="list" v-if="pro.liangtiRemark!=null">
        <p style="font-weight: bolder">量体备注</p>
        <p style="font-weight: bolder">{{ pro.liangtiRemark }}</p>
        <!--        <ul>
                  <li><label>{{ pro.liangtiRemark }}</label></li>
                </ul>-->
      </div>


      <div v-show="false">
        <!--量体图片-->
        {{ pro.liangtiImgs != null ? pro.imglist = pro.liangtiImgs.split(",") : pro.imglist = [] }}
      </div>
      <div>
        <img data-action="zoom" v-for="(oneimg,index3) in pro.imglist"
             style="width: 100px; height: 100px;margin-right:10px"
             :src="oneimg"
             fit="fit"></img>
      </div>

      <div class="list">
        <div class="ttl">附加条件</div>
        <el-form ref="forms" label-width="90px">
          <el-form-item :label="fujiaTop.premiumItem" v-for="(fujiaTop,index) of pro.fujiaList" :key="index">
            <el-radio-group v-model="form.radioArray[index]"
                            @change="test(pro.id,form.radioArray[index],fujiaTop.id)">
              <el-radio-button v-for="onecost in fujiaTop.addSystemPriceInfoList"
                               :label="onecost.costId">
                <span style="text-align: center;align-content: center">{{ onecost.premiumItem }}</span>
              </el-radio-button>
            </el-radio-group>
          </el-form-item>

          <!--<el-form-item label="品牌标">
              <el-radio-group v-model="pro.brandLabel">
                  <el-radio-button v-for="ppb in pinpaibiao" :label="ppb.pingpai_name"
                                   :value="ppb.pingpai_name"></el-radio-button>
              </el-radio-group>
          </el-form-item>-->
        </el-form>
      </div>
    </div>


    <div class="list">
      <div class="ttl">订单费用明细</div>
      <div class="tixingttl">
        <!--        <div class="ttl">面料费用</div>-->
        <p style="font-weight: bolder">面料费用</p>
      </div>
      <!--mianliaoTableList-->
      <el-table :data="datalist.allFabric" style="width: 100%" :border="true"
                :header-cell-style="{'text-align':'center'}"
                :cell-style="{'text-align':'center'}">
        <el-table-column prop="id" label="序号" width="50"></el-table-column>
        <el-table-column prop="fabricCode" label="面料编号"></el-table-column>
        <el-table-column prop="mishu" label="米数"></el-table-column>
        <el-table-column prop="fabricPrice" label="阶梯价"></el-table-column>
        <el-table-column prop="kehuzk" label="客户折扣" :formatter="parseDiscount"></el-table-column>
        <el-table-column prop="afterPrice" label="折后单价"></el-table-column>
        <el-table-column prop="allPrice" label="总金额"></el-table-column>
        <!--</el-table-column>-->
      </el-table>
      <br/>
      <!--      <div class="ttl">加工费用</div>-->
      <p style="font-weight: bolder">加工费用</p>
      <el-table :data="datalist.productInfoList" style="width: 100%" :border="true"
                :header-cell-style="{'text-align':'center'}"
                :cell-style="{'text-align':'center'}">
        <el-table-column label="序号" width="50">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column prop="productName" label="产品名称"></el-table-column>
        <el-table-column prop="gyname" label="工艺"></el-table-column>
        <el-table-column prop="numbers" label="数量"></el-table-column>
        <!--<el-table-column label="性别" prop="sex" :formatter="getSex"></el-table-column>-->
        <el-table-column prop="zheqianPrice" label="标准单价"></el-table-column>
        <el-table-column prop="khzk" label="客户折扣" :formatter="parseDiscount2"></el-table-column>
        <el-table-column prop="afterzhekouPrice" label="折后单价"></el-table-column>
        <el-table-column prop="afterzhekouPrice" label="总金额"></el-table-column>
        <!--</el-table-column>-->
      </el-table>
      <br/>
      <div class="ttl">加价项目</div>
      <!--      <div class="ttl">绣字撞色加价</div>-->
      <p style="font-weight: bolder">绣字撞色加价</p>
      <!--      <div class="towttl">加价项目</div>-->
      <el-table :data="jiajiaList" style="width: 100%" :border="true"
                :header-cell-style="{'text-align':'center'}"
                :cell-style="{'text-align':'center'}">
        <el-table-column label="序号" width="50">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column label="品类名称" prop="productName"></el-table-column>
        <el-table-column label="项目" prop="costName"></el-table-column>
        <el-table-column prop="price" label="金额"></el-table-column>
      </el-table>

      <!--      <div class="ttl">辅料加价</div>-->
      <p style="font-weight: bolder">辅料加价</p>
      <el-table :data="shouFeiList" style="width: 100%" :border="true"
                :header-cell-style="{'text-align':'center'}"
                :cell-style="{'text-align':'center'}">
        <el-table-column label="序号" width="50">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column label="品类名称" prop="plname"></el-table-column>
        <el-table-column label="项目" prop="name"></el-table-column>
        <el-table-column label="类型" prop="type"></el-table-column>
        <el-table-column label="金额" prop="price"></el-table-column>
      </el-table>

      <!--      <div class="ttl">收费服务</div>-->
      <p style="font-weight: bolder">收费服务</p>
      <el-table :data="orderFujiaList" style="width: 100%" :border="true"
                :header-cell-style="{'text-align':'center'}"
                :cell-style="{'text-align':'center'}">

        <el-table-column label="序号" width="50">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column label="品类名称" prop="cateogryName"></el-table-column>
        <el-table-column label="产品名称" prop="productName"></el-table-column>
        <el-table-column label="收费项目" prop="costName"></el-table-column>
        <el-table-column label="金额(元)" prop="price"></el-table-column>
      </el-table>

      <!--      <div>产品+面料+辅料加价：<span style="color:#D70101"><strong>{{ datalist.orderMoney }}</strong>元</span></div>
            <div>其他加价金额：<span style="color:#D70101"><strong>{{ jiajiaMoney }}</strong>元</span></div>-->
      <div v-if="moneyFlag">订单总金额：<span style="color:#D70101"><strong>请点击计算</strong></span></div>
      <div v-if="!moneyFlag">订单总金额：<span style="color:#D70101"><strong>{{ lastPrice }}</strong>元</span></div>
    </div>
    <div class="list">
      <div class="ttl">订单备注</div>
      <div style="margin-bottom: 20px;">
        <el-input
            :autosize="{ minRows: 6 }"
            style="width: 550px;"
            type="textarea"
            v-model="datalist.remark"
            placeholder="请输入内容"
            maxlength="200"
            show-word-limit
        >
        </el-input>
      </div>
      <div>
        <el-button @click="submit()" type="success">提交订单</el-button>
        <el-button @click="compudePriceFunc" type="primary">价格计算</el-button>
        <el-button @click="jixu_edit" type="primary">继续编辑</el-button>
      </div>
    </div>

    <!--支付界面弹窗-->
    <!--<el-drawer
            class="el-drawer__body"
            title="详细"
            size="40%"
            :with-header="false"
            :visible.sync="drawer"
            :direction="direction">
        <div style="height: 30px;line-height: 30px;left: 10px;padding-left: 26px;margin-top: 16px;">
            <i class="el-icon-s-order" style="font-size: 16px;">订单结算</i>
        </div>

        <div style="margin-top: 12px;"><span
                style="color: #ADADAD;font-size: 14px;margin-left: 26px;">支付金额（元）</span></div>
        <div style="margin-top: 12px;"><span style="color: #333333;font-size: 18px;margin-left: 26px;">{{datalist.orderMoney}}</span>
        </div>
        <div style="margin-top: 36px;"><span style="color: #333333;font-size: 14px;margin-left: 26px;">充值方式</span>
        </div>


        <div style="margin-top: 18px;padding-left: 26px;">
            <el-radio v-model="radio1" label="1" border>支付宝支付</el-radio>
            <el-radio v-model="radio1" label="2" border>微信支付</el-radio>
            <el-radio v-model="radio1" label="3" border>余额支付</el-radio>
        </div>

        &lt;!&ndash;<div style="margin-top: 36px;"><span style="color: #333333;font-size: 14px;margin-left: 26px;">充值金额</span></div>
        <div style="margin-top: 18px;padding-right: 26px;padding-right: 130px;"><el-input v-model="input_money" placeholder="请输入你要充值的金额" style="color: #ADADAD;font-size: 14px;margin-left: 26px;"></el-input></div>
        <div style="margin-top: 8px;"><span style="color: #ADADAD;font-size: 2px;margin-left: 26px;">充值规则：最小可充值100元</span></div>&ndash;&gt;

        <div style="margin-top: 36px;"><span style="color: #333333;font-size: 14px;margin-left: 26px;">当前余额</span>
        </div>

        <div style="margin-top: 12px;"><span style="color: #333333;font-size: 18px;margin-left: 26px;">月结额度：{{userDetail.monthLines}}元</span>
        </div>
        <div style="margin-top: 12px;"><span style="color: #333333;font-size: 18px;margin-left: 26px;">账户余额：{{userDetail.accountBalance}}元</span>
        </div>
        &lt;!&ndash;<div style="margin-top: 12px;"><span style="color: #333333;font-size: 18px;margin-left: 26px;">{{userDetail.monthLines}}元</span>&ndash;&gt;
        &lt;!&ndash;</div>&ndash;&gt;

        <el-button type="primary" @click="buynow"
                   style="background: #303030;margin-left: 26px;margin-top: 36px;"><span
                style="font-size: 14px;color: #FFE56D">立即支付</span></el-button>
    </el-drawer>-->
  </div>
</template>

<script>
import $ from 'jquery'
import {getAction} from "../../api/manage";

export default {
  data() {
    return {
      orderFujiaList: [], // 订单已选中附加条件列表
      form: {//为多个单选框
        radioArray: []
      },
      select: ['', '', '', '', '', '', ''],
      shouFeiList: [], //里布、纽扣列表
      shouFeiPrice: '', // 里布、纽扣价格
      allfujiaPrice: 0, //
      lastPrice: '', // 点击计算价格之后的最终价格
      moneyFlag: true, // 价格的显示
      jiajiaList: [], // 加价的列表
      jiajiaMoney: '', // 加价的全部价格
      userDetail: {},
      url: {
        userDetail: '/fabricAndOther/getUserDetail', // 查余额
        listJiajia: '/fabricAndOther/listJiajia', // 查询所有加价服务
        saveFujia: '/fabricAndOther/saveFujia', // 保存附加条件
        compudePrice: '/fabricAndOther/compudePrice', // 计算价格的方法
        getallPrice: '/fabricAndOther/getallPrice', // 真·计算价格的方法
        shouFeifuwuXiang: '/fabricAndOther/shouFeifuwuXiang', // 个订收费服务项的价格（里布、纽扣等的价格）
        listFujia: '/fabricAndOther/listFujia', // 订单附加条件列表
        buyNow: '/Order/buyNow' // 立即支付
      },
      autohor_token: localStorage.getItem("token"), //token
      radio1: '',
      drawer: false,
      datalist: [],
      sexs: ['男', '女'],
      staus: ['草稿订单', '已支付', '已提交', '已接单', '等待面料', '裁剪', '缝制', '发货', '订单完成', '', '', '未付款'],
      mianliaottl: ['面料', '里布', '底领呢'],
      productList: [],
      mianliaoTableList: [],//所有产品面料集合
      arrList: {
        '订单信息': {
          orderSn: '',
          storeCode: '',
          createTime: '',

        }
      },
      radioData: [],
      pinpaibiao: [],//品牌标
    }
  },
  async created() {
    if (this.$route.params.oid) {
      const loading = this.$loading({
        lock: true,
        text: '数据拼命加载中...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      let params = new FormData();
      params.append('token', localStorage.getItem("token"));
      params.append('orderSn', this.$route.params.oid);
      await this.$http.post('/fabricAndOther/getDingleOrderDetail', params).then((res) => {
        loading.close();
        this.datalist = res.data.data;
        this.productList = res.data.data.productInfoList
        this.$store.state.OrderUser.Order_user_InfoData.token = localStorage.getItem("token");
        for (let item of res.data.data.productInfoList) {
          this.getRadio(4, item.id, item)
          // 遍历附加条件
          var lastarr = new Array()
          if (item.fujiaids != null) {
            var fList = item.fujiaids.split(",")
            if (fList != null) {
              for (let oneid of fList) {
                // 每一个上级id和收费项id
                var alist = oneid.split("/")
                if (alist != null) {
                  lastarr.push(alist)
                }
              }
            }
          }
          item.fList = lastarr
          console.log(item.fList)
          // alert(item.fList.length)

          if (!!item.fabricList) {
            for (let li of item.fabricList) {
              this.mianliaoTableList.push(li);
            }
          }
        }
      });
      // this.compudePriceFunc2()
      this.getuserDetail()
      this.listJiajiaFunc()
      /*await this.$http.get('/company/getidentification?token=' + localStorage.getItem("token")).then(res => {
        this.pinpaibiao = res.data.data;
      })*/
    } else {
      this.$router.push('/');
    }

    this.shouFeifuwuXiangFunc()
    this.listFujiaFunc()
  },
  mounted() {
    $('.hover .el-radio-button__inner').hover(function () {
      switch ($(this).text()) {
        case '常规':
          $(this).text('7个工作日');
          break;
        case '加急':
          $(this).text('5个工作日200元');
          break;
        case '特急':
          $(this).text('3个工作日400元');
          break;
      }
    }, function () {
      $(this).text($(this).prev('input').val());
    })
  },
  methods: {

    /**
     * 获取已经选择的附加条件
     */
    listFujiaFunc() {
      getAction(domain.publicUrl + this.url.listFujia, {
        'orderSn': this.datalist.orderSn
      }).then(res => {
        if (res.data.code == 0) {
          this.orderFujiaList = res.data.data
        }
      })
    },

    jixu_edit() {//继续编辑
      this.$router.go(-1);//返回上一层
    },
    /**
     * 获取里布价格列表
     */
    shouFeifuwuXiangFunc() {
      getAction(domain.publicUrl + this.url.shouFeifuwuXiang, {
        'orderSn': this.$route.params.oid
      }).then(res => {
        if (res.data.code == '0') {
          this.shouFeiList = res.data.data
          this.shouFeiPrice = res.data.price
        }
      })
    },

    /**
     * 选中的时候要把选中的主键id给产品
     * @param priceid 成本id
     * @param type 附加条件类型 0 式样，1紧急指数，2该款打样
     * @param pro 产品对象
     */
    test(proid, priceid, type) {
      if (priceid == null) {
        this.$message.warning("该选项没有设置售价，请先设置售价");
        return
      } else {
        // alert(priceid+"=="+type)
        getAction(domain.publicUrl + this.url.saveFujia, {
          'productid': proid,
          'priceid': priceid,
          'type': type // 具体金额的上级id
        }).then(res => {
          if (res.data.code == '0') {
            this.listFujiaFunc()
          }
        })
      }
      /*let prodyct = this.datalist.productInfoList
      let fujiaPrice = 0.0
      for (var i = 0; i < prodyct.length; i++) {
          var shi = isNaN(Number(prodyct[i].shiyang)) ? 0 : Number(prodyct[i].shiyang)
          var eme = isNaN(Number(prodyct[i].emergency)) ? 0 : Number(prodyct[i].emergency)
          var yang = isNaN(Number(prodyct[i].modifiedYang)) ? 0 : Number(prodyct[i].modifiedYang)
          fujiaPrice = shi + eme + yang;
      }
      this.allfujiaPrice = fujiaPrice*/
    },

    /**
     * 单个产品的价格计算
     */
    productComputed() {

    },

    /**
     * 计算价格的方法
     */
    compudePriceFunc() {
      this.moneyFlag = false
      getAction(domain.publicUrl + this.url.getallPrice, {
        // 'price': Number(this.datalist.orderMoney) + Number(this.jiajiaMoney) + Number(this.shouFeiPrice),
        'price': Number(this.datalist.orderMoney) + Number(this.jiajiaMoney) + Number(this.shouFeiPrice),
        'orderSn': this.datalist.orderSn
      }).then(res => {
        if (res.data.code == '0') {
          this.$message.success('计算完成')
          this.lastPrice = res.data.data
        } else {
          this.lastPrice = Number(this.datalist.orderMoney) + Number(this.jiajiaMoney)
        }
      })
    },

    /**
     * 奇怪的方法
     */
    compudePriceFunc2() {
      this.moneyFlag = false
      /*getAction(domain.publicUrl + this.url.getallPrice, {
        'price': Number(this.datalist.orderMoney) + Number(this.jiajiaMoney) + Number(this.shouFeiPrice),
        'orderSn': this.datalist.orderSn
      }).then(res => {
        if (res.data.code == '0') {
          // this.$message.success('查询成功')
          this.lastPrice = res.data.data
        } else {
          this.lastPrice = Number(this.datalist.orderMoney) + Number(this.jiajiaMoney)
        }
      })*/
      this.moneyFlag = true
    },

    /**
     * 获取加价服务列表
     */
    listJiajiaFunc() {
      getAction(domain.publicUrl + this.url.listJiajia, {
        'orderSn': this.datalist.orderSn
      }).then(res => {
        if (res.data.code == '0') {
          this.jiajiaList = res.data.data
          this.jiajiaMoney = res.data.allMoney
        } else {
          this.$message.error("查询失败")
        }
      })
    },

    // 立即支付
    buynow() {
      if (this.radio1 == '') {
        this.$message.warning("请选择支付方式!")
        return;
      } else if (this.radio1 == '1') {
        this.$message.warning("正在开发中")
        return;
      } else if (this.radio1 == '2') {
        this.$message.warning("正在开发中")
        return;
      } else if (this.radio1 == '3') {
        getAction(domain.publicUrl + this.url.buyNow, {
          'token': this.autohor_token,
          'orderType': 0,
          'orderSn': this.datalist.orderSn,
          'remark': this.datalist.remark,
        }).then(res => {
          this.drawer = false
          if (res.data.code == '0') {
            this.$message.success("支付成功")
            this.$router.push({path: '/'});
          } else {
            this.$message.error(res.data.msg)
          }
        })
      }
    },
    // 查询用户详情
    getuserDetail() {
      getAction(domain.publicUrl + this.url.userDetail, {
        'token': this.autohor_token
      }).then(res => {
        if (res.data.code == '0') {
          this.userDetail = res.data.data
        }
      })
    },

    submit() {
      if (this.moneyFlag) {
        this.$message.warning("请先进行计算计算")
        return
      } else {
        let p1 = new FormData();
        p1.append('token', localStorage.getItem("token"));
        p1.append('orderID', this.datalist.id);
        p1.append('remark', this.datalist.remark);
        p1.append('shiyang', this.datalist.shiyang);
        p1.append('modifiedYang', this.datalist.modifiedYang);
        p1.append('emergency', this.datalist.emergency);
        p1.append('brandLabel', this.datalist.brandLabel);
        p1.append('orderMoney', this.lastPrice);
        this.$http.post('/fabricAndOther/submitOrder', p1).then(res => {
          if (res.data.code == 0) {
            this.$message.success("提交成功")
            this.$router.push({path: '/'})
          } else {
            this.$message.error("此订单已提交，请勿重复提交")
            this.$router.push({path: '/my-order'})
          }
        })
      }
    },
    getSex(row, column) {
      return row.sex === 0 ? "男" : "女";
    },
    /**
     * 解析折扣
     */
    parseDiscount(row, column) {
      if (row.kehuzk == '1') {
        return '100%'
      } else {
        return (Number(row.kehuzk) * 100) + "%"
      }
    },

    /**
     * 解析折扣
     */
    parseDiscount2(row, column) {
      if (row.khzk == '1') {
        return '100%'
      } else {
        return (Number(row.khzk) * 100) + "%"
      }
    },

    /**
     * 获取附加条件
     * @param type
     */
    getRadio(type, productID, item) {
      let p1 = new FormData();
      p1.append('type', type);
      p1.append('order_type', 0);
      p1.append('product_id', productID);
      this.$http.post('logic/interface/query_system_addpriceInfo', p1).then(res => {
        // this.radioData.push(res.data.data);
        item.fujiaList = res.data.data
        this.compudePriceFunc2()
      })
    }
  },
}
</script>

<style scoped lang="scss">
#viewInfo {
  background: #ffffff;
  margin-top: 20px;
  padding: 30px 20px;
}

#viewInfo .list {
  margin-bottom: 20px;

  .list-div {
    display: flex;
    flex-wrap: wrap;

    div {
      width: 33.3%;
      display: flex;
      height: 36px;
      align-items: center;

      p {
        width: 112px;
        padding: 2px 2px 2px 24px;
        background-color: rgba(249, 249, 249, 1);
        font-size: 15px;
        color: #333;
        display: flex;
        height: 36px;
        align-items: center;
        margin: 0px !important;
      }

      span {
        width: calc(100% - 112px);
        padding: 2px 2px 2px 24px;
        font-size: 15px;
        color: #333;
        display: flex;
        height: 36px;
        align-items: center;

        &.b {
          font-weight: 700;
        }
      }
    }
  }
}

#viewInfo .ttl {
  margin: 10px 0 20px 0px;
  border-left: 5px solid #000000;
  padding-left: 15px;
  font-size: 18px;
  font-weight: bold;
}

#viewInfo ul {
  color: #333333;
  display: flex;
  flex-wrap: wrap;
  padding: 0 20px;
}

#viewInfo ul li {
  display: inline-flex;
  width: 30%;
  height: 40px;
  line-height: 40px;
  margin: 0 20px 0px 0;
}

#viewInfo ul li label {
  width: 100px;
  padding-left: 20px;
  background-color: rgba(249, 249, 249, 1);
  margin-right: 20px;
}

#viewInfo .tixingttl {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

#viewInfo .towttl {
  padding-left: 25px;
  margin-bottom: 20px;
}

.tixing {
  float: right;
  padding: 15px 30px;
  background-color: rgba(255, 221, 202, 1);
  color: #FB0808;
  font-size: 14px;
}

#viewInfo /deep/ .el-radio-button__orig-radio:checked + .el-radio-button__inner {
  color: $color;
}

#viewInfo /deep/ .el-form .el-form-item__label {
  background-color: rgba(249, 249, 249, 1);
  margin-right: 5px;
}

#viewInfo /deep/ .el-form span {
  border-radius: 0;
}

#viewInfo .el-table /deep/ thead tr th {
  background-color: #f9f9f9 !important;
}

#viewInfo .el-table /deep/ tbody tr {
  background-color: #ffffff !important;
}

#viewInfo .el-table button {
  color: $color;
}

.el-table--border:after,
.el-table--group:after,
.el-table:before {
  background-color: #ffffff;
}

.el-table--border,
.el-table--group {
  border-color: #ffffff;
}

.el-table td,
.el-table th.is-leaf {
  border-bottom: 1px solid #ffffff;
}

.el-table--border th,
.el-table--border th.gutter:last-of-type {
  border-bottom: 1px solid #ffffff;
}

.el-table--border td,
.el-table--border th {
  border-right: 1px solid #ffffff;
}

#viewInfo /deep/ .el-table th.is-leaf, .el-table td {
  border-color: #ffffff;
}

.el-table--border::after, .el-table--group::after, .el-table::before {
  background-color: #ffffff;
}

#viewInfo /deep/ .el-radio-group {
  display: table;
  /*双击文字、input等，出现的蓝色底色，如何去除*/
  -moz-user-select: none; /*火狐*/
  -webkit-user-select: none; /*webkit浏览器*/
  -ms-user-select: none; /*IE10*/
  /*-khtml-user-select:none;!*早期浏览器*!*/
  user-select: none;
}

#viewInfo /deep/ .el-radio-group span {
  width: 150px;
  border-left: 1px solid #DCDFE6 !important;
  margin: 0 5px 5px 0;
}

@import '~@/mixins/zoom.css';
</style>
